<template>
  <div class="angle-arrow-box">
		<div class="angle-arrow angle-arrow-1"></div>
		<div class="angle-arrow angle-arrow-2"></div>
		<div class="angle-arrow angle-arrow-3"></div>
		<div class="angle-arrow angle-arrow-4"></div>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				
			}
		},
		methods: {
			
		},
		created(){
			
		}
	}
</script>
<style lang="scss" scoped="scoped">
	.angle-arrow{
		position: absolute;
		width: 9px;
		height: 9px;
		&.angle-arrow-1{
			background: url(../../assets/data-images/angle-line-icon.png) no-repeat;
			left: 0;
			top: 0;
		}
		&.angle-arrow-2{
			background: url(../../assets/data-images/angle-line-icon.png) no-repeat;
			right: 0;
			top: 0;
			transform: rotate(90deg);
		}
		&.angle-arrow-3{
			background: url(../../assets/data-images/angle-line-icon.png) no-repeat;
			left: 0;
			bottom: 0;
			transform: rotate(-90deg);
		}
		&.angle-arrow-4{
			background: url(../../assets/data-images/angle-line-icon.png) no-repeat;
			right: 0;
			bottom: 0;
			transform: rotate(-180deg);
		}
	}
</style>